import React from 'react';
import { Button, Carousel } from 'antd-mobile';
import './Upvote.css'
class Upvote extends React.Component {    
    constructor(props) {
        super(props); 
        this.upvote = this.upvote.bind(this);    
        this.state = {
            upvoteImgStyle: 'upvote-img-unupvoted',
            upvoteTextStyle: 'upvote-text-unupvoted',
            upvoted: false
        };   
    }
    upvote() {
        console.log('fuck!');
        if( this.state.upvoteImgStyle == 'upvote-img-unupvoted' ) {
            this.setState({
                upvoteImgStyle: 'upvote-img-upvoted',
                upvoteTextStyle: 'upvote-text-upvoted',
                upvoted: true
            })
        } else if ( this.state.upvoteImgStyle == 'upvote-img-upvoted' ) {
            this.setState({
                upvoteImgStyle: 'upvote-img-unupvoted',
                upvoteTextStyle: 'upvote-text-unupvoted',
                upvoted: false
            })
        }
    }    
    render() {
        return (
            <div className="upvote-wrap">
                <a onClick={ this.upvote }>
                    <div onClick={ this.upvote } className={ this.state.upvoteImgStyle } src="" />
                    <span onClick={ this.upvote } className={ this.state.upvoteTextStyle } >点赞</span>
                </a>
            </div>
        )
    }
}

//导出组件
export default Upvote;
